<template>
    <div class="wrap">
        <div class="container">
            <TopBreadCrumb></TopBreadCrumb>
            <div class="user_center_content">
                <!-- 左侧菜单 -->
                <LeftNavMenu></LeftNavMenu>
                <!-- 左侧菜单结束 -->
                <!-- 右侧内容开始  -->
                <div class="right_user_content">
                    <div class="select_nav_title border-bottom" style="padding-bottom: 10px;">
                        <div class="title">关联企业</div>
                        <div class="order_search">
                            <input type="text" placeholder="输入关键词进行搜索" />
                            <el-button icon="el-icon-search" circle></el-button>
                        </div>
                    </div>
                    <div class="enterprise-list">
                        <!-- 关联企业列表 -->
                        <div class="enterprise-card" v-for="(item, index) in data.data" :key="index">
                            <div class="enterprise-card-head">
                                <div class="hd">{{ item.name }}</div>
                                <div>{{ status }}</div>
                            </div>
                            <div class="enterprise-card-cont">
                                <ul>
                                    <li><span>公司性质：</span>{{ item.type }}</li>
                                    <li><span>企业用户名：</span>{{ item.username }}</li>
                                    <li><span>公司电话：</span>{{ item.telephone }}</li>
                                    <li><span>企业联系人姓名：</span>{{ item.contacts_name }}</li>
                                    <li><span>公司地址：</span>{{ item.address }}</li>
                                    <li><span>企业联系人电话：</span>{{ item.contacts_phone }}</li>
                                    <li>
                                        <span>营业执照：</span>
                                        <div class="img-zj">
                                            <el-image 
                                                :src="$commonImageUrl(item.business_permit)" 
                                                :preview-src-list="[$commonImageUrl(item.business_permit)]">
                                            </el-image>
                                        </div>
                                    </li>
                                    <li>
                                        <span>经营许可证：</span>
                                        <div class="img-zj">
                                            <el-image 
                                                :src="$commonImageUrl(item.business_license)" 
                                                :preview-src-list="[$commonImageUrl(item.business_license)]">
                                            </el-image>
                                            <!-- <img src="@/assets/images/yyzz.png" /> -->
                                        </div>
                                    </li>
                                </ul>
                                <div class="enterprise-orders">
                                    <el-button class="btn-main" @click="onSumbitPlaceOrder(item)">通过该企业下单</el-button>
                                </div>
                            </div>
                        </div>
                        <Custom-pagination :total="data.total" :page.sync="query.page" :pageSize.sync="query.pageSize" @pagination="LoadDataList" :hidden="pageHidden"></Custom-pagination>
                    </div>
                </div>
                <!-- 右侧内容结束 -->
            </div>
        </div>

    </div>
</template>

<script>
    import api from "@/api/salesCenter";
    import commonApi from "@/api/common";
    import { validatePhone } from "@/utils/common";

    export default {
        data() {
            return {
                categoryList: [],
                provinceList: [],
                addLoading: false,

                
                query: {
                    page: 1,
                    pageSize: 4,
                    type:0
                },
                data: {
                    data: [],
                    total: 0
                },
                pageHidden: true
            };
        },
        methods: {
            isInvalid(field) {
                return field in this.errorInfo;
            },
            getErrorMessage(field) {
                return this.errorInfo[field];  
            },
            
            // 获取列表数据
            LoadDataList() {
                api.GetEnterprisePageList(this.query)
                    .then((res) => {
                        this.data = res.data;
                        this.pageHidden = false;
                        if (this.query.pageSize >= this.data.total) {
                            this.pageHidden = true;
                    }
                })
            },
            onSumbitPlaceOrder(val) { 
                console.log("val",val)
                this.$confirm('通过【' + val.name+"】公司采购下单吗？", '产品采购', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                }).then(() => {
                    let input = {
                        enterprise_id: val.id
                    };
                    api.UserEnterprise(input).then((res) => { 
                        // this.$message({
                        //     type: 'success',
                        //     message: res.msg
                        // });
                        //去产品采购页面
                        this.$router.push('/products/list');
                    })
                }).catch(() => {
                    this.$message({
                    type: 'info',
                    message: '已取消'
                });          
                }); 
            }
        },
        mounted: function(){
            this.LoadDataList();
        },
        created() {
            
        }
    };
</script>
<style>



</style>